<include file="Public/header"/>

<div class="x-body">
    <form class="layui-form" action="{:U('update')}" method="post">
        <div class="layui-form-item">
            <label for="sort" class="layui-form-label">
                <span class="x-red"></span>图标
            </label>
            <div class="layui-input-inline">
                <div class="layui-upload-list">
                    <input type="hidden" name="icon"  value="{$data['icon']}" >
                    <img class="layui-upload-img" style="width: 100px;" id="avatar-preview" src="{$data['icon']}">
                    <p id="demoText"></p>
                </div>
                <button type="button" class="layui-btn" id="avatar-btn">
                    <i class="layui-icon">&#xe67c;</i>上传图片
                </button>
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red"></span>
            </div>
        </div> 
        <div class="layui-form-item">
            <label for="username" class="layui-form-label">
                <span class="x-red">*</span>分类名称
            </label>
            <div class="layui-input-inline" style="width:80%;">
                <input type="text" id="name" name="name" required="" lay-verify="required"
                       autocomplete="off" value="{$data['name']}" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red"></span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="sort" class="layui-form-label">
                <span class="x-red"></span>自定义排序
            </label>
            <div class="layui-input-inline" style="width:80%;">
                <input type="text" id="sort" name="sort"
                       autocomplete="off" value="{$data['sort']}" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red"></span>
            </div>
        </div>
     
        <input type="hidden" name="id"  value="{$data['id']}">
        <div class="layui-form-item">
            <label for="L_repass" class="layui-form-label">
            </label>
            <button  class="layui-btn" lay-filter="submit" lay-submit="submit">保存</button>
        </div>
    </form>
</div>
<script>

    layui.use('upload', function(){
        var $ = layui.jquery;
        var upload = layui.upload;
        //执行实例
        var uploadInst = upload.render({
            elem: '#avatar-btn',
            url: "{:U('Upload/uploadpic')}",
            data:{
                name:'img'
            },
            field:'img',
            before: function(obj){

                //预读本地文件示例，不支持ie8

                obj.preview(function(index, file, result){

                    $('#avatar-preview').attr('src', result); //图片链接（base64）

                });

            },
            done: function(res){

                if(res.code!=0){

                    layer.msg(res.msg,{icon: 5});

                }

                //上传成功

                if(res.code==0 ){

                    layer.msg('上传成功',{icon: 6});

                    $("[name='icon']").val(res.data);

                }

            },
            error: function(){

                //演示失败状态，并实现重传

                var demoText = $('#demoText');

                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');

                demoText.find('.demo-reload').on('click', function(){

                    uploadInst.upload();

                });

            }

        });

    });

</script>
<include file="Public/footer"/>